<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-theme.css">
    <link rel="stylesheet" href="css/iconfont.css">
    <link rel="stylesheet" href="css/hj-student.css">
    <title>Title</title>
</head>
<!--是否删除的弹框-->
<div class="modal fade bs-example-modal-sm" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
                <h4 class="modal-title container" id="myModalLabel">确定要删除吗?</h4>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-info xsYesDel" data-dismiss="modal">确定</button>
                <button type="button" class="btn btn-default xsCancel ">取消</button>
            </div>
        </div>
    </div>
</div>
<!--添加、编辑的横态框-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
                <h4 class="modal-title" id="myModalLabel2"><span>学生信息一览</span></h4>
            </div>
            <div class="table-responsive modal-body">
                <form action="" id="xsForm">
                    <table class=" xsAddTab ">
                        <tr>
                            <td>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</td>
                            <td><input type="text" class="xsTableStuName xsZzName"><span></span></td>
                            <td>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别</td>
                            <td>
                                <div><input type="radio" name="sex" value="nan" class="nan">男</div>
                                <div><input type="radio" name="sex" value="nv" class="nv">女</div>
                            </td>
                        </tr>
                        <tr>
                            <td>出生日期</td>
                            <td><input type="date" class="xsBirthDate"><span></span></td>
                            <td>会员状态</td>
                            <td>
                                <div><input type="radio" name="state" value="member" class="xsInputSate">会员</div>
                                <div><input type="radio" name="state" value="nonmember" class="xsInputUnSate">非会员</div>
                            </td>
                        </tr>
                        <tr>
                            <td>所属学校</td>
                            <td>
                                <select name="" class="xsSelectSchool">
                                </select>
                            </td>
                            <td>所属班级</td>
                            <td>
                                <select name="" class="xsSelectClass">
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>家庭住址</td>
                            <td><input type="text" class="xsAddress"></td>
                            <td>联系电话</td>
                            <td><input type="tel" class="xsInputTel xsZzTel"><span></span></td>
                        </tr>
                        <tr>
                            <td>父亲姓名</td>
                            <td><input type="text" class="xsFatherInputName xsZzName"><span></span></td>
                            <td>父亲电话</td>
                            <td><input type="tel" class="xsFatherInputTel xsZzTel"><span></span></td>
                        </tr>
                        <tr>
                            <td>母亲姓名</td>
                            <td><input type="text" class="xsMotherInputName xsZzName"><span></span></td>
                            <td>母亲电话</td>
                            <td><input type="tel" class="xsMotherInputTel xsZzTel"><span></span></td>
                        </tr>
                        <tr>
                            <td>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</td>
                            <td colspan="3">
                                <textarea cols="58" class="xsInputRemark"></textarea>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-info xsYes" data-dismiss="modal">确定</button>
                <button type="button" class="btn btn-default xsCancel">取消</button>
            </div>
        </div>
    </div>
</div>
<!--查看的模态框-->
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
                <h4 class="modal-title" id="myModalLabel3"><span>学生详情</span></h4>
            </div>
            <div class="modal-body table-responsive">
                <table class="table table-hover table-bordered xsInfoTable">
                    <tr>
                        <td>姓名</td>
                        <td class="xsInfoName"></td>
                        <td>性别</td>
                        <td class="xsInfoSex"></td>
                    </tr>
                    <tr>
                        <td>出生日期</td>
                        <td class="xsInfoDate"></td>
                        <td>年龄</td>
                        <td class="xsInfoAge"></td>
                    </tr>
                    <tr>
                        <td>所属班级</td>
                        <td class="xsInfoClass"></td>
                        <td>联系电话</td>
                        <td class="xsInfoTel"></td>
                    </tr>
                    <tr>
                        <td>家庭住址</td>
                        <td class="xsInfoAddress"></td>
                        <td>学生状态</td>
                        <td class="xsInfoState"></td>
                    </tr>
                    <tr>
                        <td>父亲姓名</td>
                        <td class="xsInfoFather"></td>
                        <td>父亲电话</td>
                        <td class="xsInfoFatherTel"></td>
                    </tr>
                    <tr>
                        <td>母亲姓名</td>
                        <td class="xsInfoMother"></td>
                        <td>母亲电话</td>
                        <td class="xsInfoMotherTel"></td>
                    </tr>
                    <tr>
                        <td>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</td>
                        <td colspan="3" class="xsInfoComment"></td>
                    </tr>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary xsCancel">确定</button>
            </div>
        </div>
    </div>
</div>
<body>
<main class="xsMain">
    <section>
        <!--        选择下拉列表-->
        <div class="xsSelect">
            <span>选择市：</span>
            <select name="" class="xsShiSelect">
                <option value="wu">==请选择==</option>
            </select>
            <span >选择学校：</span>
            <select name="" class="xsSchoolSelect">
                <option value="wu">==请选择==</option>
            </select>
            <span class="btn iconfont icon-sousuo xsSelectYes"></span>
        </div>
        <!--        删除添加共有数据-->
        <div class="mid">
            <div class="left">
                <button type="button" class="btnDelAll xsBatch" >
                    <span class="iconfont icon-shanchu"></span>批量删除
                </button>
                <button type="button" class="btnAdd xsAddStd" ><span
                        class="iconfont icon-add"></span>添加
                </button>
            </div>
            <div class="right dataNum">
                共有数据： <span id="xsAllNumber"></span>  条
            </div>
        </div>
        <!--        表格-->
        <div class="xsDisTable">
            <table border="0" cellpadding="0" cellspacing="0" class="table table-hover">
                <thead>
                <tr>
                    <th><input type="checkbox" id="xsAllCheck"></th>
                    <th>学号</th>
                    <th>学生姓名</th>
                    <th>性别</th>
                    <th>班级</th>
                    <th>状态</th>
                    <th>联系电话</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody class="tbCard">
                </tbody>
            </table>
        </div>

        <!--        分页-->
        <div class="xsPage de_pageBt">

        </div>
    </section>
</main>
<script src="js/jquery-3.5.1.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/data.js"></script>
<script src="js/student.js"></script>
</body>
</html>